<!DOCTYPE html>
<html lang="ch" xmlns:th="http://www.thymeleaf.org">
<head>
  <script type="text/javascript"
          src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
  <meta charset="utf-8"/>
  <title></title>
  <style>
    .btn {
      text-align: center;
      padding: 10px;
      width: 100%;
      margin-top: 40px;
      background-image: linear-gradient(to right, #a6c1ee, #fbc2eb);
      color: #fff;
    }
  </style>
</head>
<body>
<button onclick="add()">添加选项</button>
<form>
  投票<input id="title"/></br>
  描述<input id="des"/>
  <div id="org"></div>
  <div class="btn" onclick="sub()">提交</div>
</form>

</body>
</html>
<script>
  function add() {
    var input1 = document.createElement('input');
    input1.setAttribute('type', 'text');
    input1.setAttribute('name', 'cc');
    input1.setAttribute('placeholder', '投票项');
    input1.setAttribute('class', 'dd');
    var btn1 = document.getElementById("org");
    var brr = document.createElement('br');
    btn1.insertBefore(input1, null);
    btn1.insertBefore(brr, null);
  }

  function sub() {
    var title = $("#title").val();
    var des = $("#des").val();
    var list = []
    var item = $(".dd")
    if (item.length == 0) {
      alert("至少加一个选项")
      return

    }
    for (var i = 0; i < item.length; i++) {
      list.push(item[i].value);
    }
    var vote = {
      "title": title,
      "description": des,
      "list": list,
    }

    var json = JSON.stringify(vote)
    $.ajax({
      url: "http://localhost:8888/add_vote_ajaix",
      type: "post",
      data: json,
      contentType: "application/json;charset=UTF-8",
      success: function (result) {
        alert("添加成功");
        location.href = "/show_votes";
      }
    })
  }
</script>
